<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>乘法口诀</title>
</head>
<body>
    <script>
        // 在body中添加一个<table></table>
        // DOM操作
        // document文档对象，调用.createElement方法 该方法用于常见标签对象
        // 并且会把标签对返回出去。(参数"table")，返回值var table
       var table = document.createElement("table")
       //  对象.属性 document.body（获取到body这个标签对象）
       //  .appendChild（） 该方法用于将标签拼接到指定对象
       document.body.appendChild(table);
        for(var x = 1; x < 10; x++){
            //外层for循环，控制了行数
            //insertRow();该方法可以直接往table中插入一个tr
            var tr = table.insertRow();
            for(var y = x; y < 10 ; y++){
                //内层for循环控制着每一行的列数
                //insertCell(); 往tr中插入td 并将td对象返回出来
                var td = tr.insertCell();
                td.innerText = x + "*" + y + "=" + x*y;
                //给td加行内样式 设置宽度
                td.style.width = "80px";
                console.log(x + "*" + y + "=" + x*y);
            }
        }

        // x =1  y= 1到9   x =2  y= 2到9
        // x =3  y= 3到9   x =4  y= 4到9
        // x =5  y= 5到9   x =6  y= 6到9
        // x =7  y= 7到9   x =8  y= 8到9
        // x =9  y= 9到9
    </script>
</body>
</html>